{extend name='layout/app' /}

{block name='css'}
<link rel="stylesheet" href="__STATIC__/css/person.css">
<style>
    body{
        min-height: 600px;
    }
    a:link,a:hover{
        text-decoration: none;
    }
    .inner-cont >div{
        padding: 5px 0;
    }
    .inner-cont2{
        width: 100%;
        color:#919191;
        font-size:16px;
        display: flex;
    }
    .inner-cont2 >div{
        width: 33%;
        flex: 1;
        text-align: center;
        justify-content: center;
    }
</style>
{/block}

{block name='content'}
<div id="app">
    <div class="nav">
        <i class="el-icon-arrow-left icon_left" @click="back"></i>
        <div>个人信息</div>
        <i class="iconfont icon-home icon_right" @click="home"></i>
    </div>
    
    <div class="init-info" style="padding: 17px 30px;">
        <div class="inner-cont-wrapper">
            <div class="avatar">
                <img src='{$Think.session.user.image}' alt="" style="border-radius: 50%">
            </div>
            <div class="inner-cont">
                <div class="nickname">{$Think.session.user.name}</div>
                <div class="phone">{$Think.session.user.phone|substr=0,3}****{$Think.session.user.phone|substr=-4,4}</div>
            </div>
        </div>
    </div>
    <div class="inner-cont2">
        <div class="remain">余额 : ¥ <span>{$info.memb_balance}</span></div>
        <div class="star-count">积分 : <span>{$info.memb_point}</span> 分</div>
        <div class="star-count" >奖品 : <span>{$award}</span> 个</div>
    </div>
    <div class="person-info">
        <div class="item">
            <a href="myorder.html">
                <i class="iconfont icon-order"></i>
                <span>寄件订单</span>
                <i class="el-icon-arrow-right"></i>
            </a>
        </div>
        <div class="item">
            <a href="mysender.html">
                <i class="iconfont icon-order" style="color: #00B83F;"></i>
                <span>收件订单</span>
                <i class="el-icon-arrow-right"></i>
            </a>
        </div>
        <div class="item">
            <a href="personInfo.html">
                <i class="iconfont icon-User"></i>
                <span>个人资料</span>
                <i class="el-icon-arrow-right"></i>
            </a>
        </div>
        <div class="item">
            <a href="/index/person/meet.html">
                <img src="/static/imgs/pengyouquan.png" alt="" style="width:5%;" >
                <span>朋友圈</span>
                <i class="el-icon-arrow-right"></i>
            </a>
        </div>
        <div class="item">
            <a href="../index/voucher.html ">
                <i class="iconfont icon-coupons_fill" style="color: #C1651C"></i>
                <span>我的奖品</span>
                <i class="el-icon-arrow-right"></i>
            </a>
        </div>
        <div class="item">
            <a href="account.html">
                <i class="iconfont icon-lock"></i>
                <span>账号与安全</span>
                <i class="el-icon-arrow-right"></i>
            </a>
        </div>
        <div class="item">
            <a href="/logout.html">
                <i class="iconfont icon-Logout"></i>
                <span>退出</span>
                <i class="el-icon-arrow-right"></i>
            </a>
        </div>
        <!--<div class="item">
            <a href="">
                <i class="iconfont icon-send"></i>
                <span>寄件记录</span>
                <i class="el-icon-arrow-right"></i>
            </a>
        </div>
        <div class="item">
            <a href="">
                <i class="iconfont icon-shoujianchenggong"></i>
                <span>收件记录</span>
                <i class="el-icon-arrow-right"></i>
            </a>
        </div>-->
    </div>
</div>
{/block}

{block name='js'}
<script>
    var that

    new Vue({
        el:'#app',
        data: {

        },
        mounted() {
            that = this  //生成vue副本
        },
        methods: {
            back() {
                window.history.go(-1)
            },
            home() {
                location.href = '/'
            }
        }
    });
</script>
{/block}